<template>
	<view>
		<uni-popup ref="selcon" zindex type="center" @maskClick="maskClick" :safeArea="false">
			<view class="modelcon" @touchmove.stop.prevent="">
				<view class="favs">提示</view>
				<view class="fav_v">抱歉，当前时间无法配送，请预约其他时间。感谢理解！</view>
				<view class="foot_btn">
					<view class="btns can" @click.stop="close">我知道了</view>
					<!-- <view class="btns su" @tap="cals(true)">好的</view> -->
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script setup lang="ts">
	import { ref, defineEmits } from 'vue';

	// import mapi from '@/utils/mapi';
	// import { mnavTo } from '@/utils/helper';
	// import { env } from '@/api/env.js'

	const emit = defineEmits(["maskClick"])
	const selcon = ref()


	const open = () => {
		selcon.value.open()
	}
	const close = () => {
		selcon.value.close()
	}

	const maskClick = (e : any) => {
		// console.log('car-maskClick',e);
		emit("maskClick")
	}

	defineExpose({ open, close })
</script>

<style lang="scss" scoped>
	.modelcon {
		width: 526rpx;
		height: 360rpx;
		padding-top: 20rpx;
		background-color: #fff;
		border-radius: 32rpx;
    position: relative;
		.favs {
			text-align: center;
			color: #000;
			font-family: "Microsoft YaHei UI";
			font-size: 36rpx;
			font-weight: 400;
		}

		.fav_v {
			padding: 20rpx 30rpx 0rpx 30rpx;
			// text-align: center;
			color: #666;
			font-family: "Microsoft YaHei UI";
			font-size: 32rpx;
			font-weight: 400;
			line-height: 45rpx;
		}

		.foot_btn {
			position: absolute;
			left:0;
			bottom:50rpx;
			display: flex;
			padding: 20rpx 35rpx 0rpx 35rpx;
			justify-content: center;
      width: 100%;
			.btns {
				width: 358rpx;
				height: 80rpx;
				text-align: center;
				line-height: 80rpx;
				border-radius: 10rpx;
			}

			.su {
				background: #5DB175;
				color: #fff;
			}

			.can {
				border: 2rpx solid #5DB175;
				color: #5DB175;
			}
		}
	}
</style>